<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学习列表</title>

    <!--引入-->
    <link rel="stylesheet"
          href="../websrc/bootstrap-3.3.7-dist/css/bootstrap.css">
    <script src="../websrc/plug-in/vue.js"></script>
    <script src="../websrc/js/jquery-3.2.1.js"></script>

    <link rel="stylesheet" href="../websrc/css/base.css">
    <link rel="stylesheet" href="mystudy.css">


    <script src="../websrc/js/common.js"></script>
    <script src="../websrc/js/loadmenu.js"></script>
    <script src="loadstudylist.js"></script>
    <script src="editstudylist.js"></script>
</head>
<body>
<div class="main clearfix">
    <div id="menu1" class="menu">
        <div>
            <h2 style="">wing</h2>欢迎回来
        </div>
        <ul>
            <li v-for="menu in menus">
                <a v-bind:class="{active:menu.isActive}" v-bind:href="menu.href">
                    {{menu.name}}
                </a>
            </li>
        </ul>
    </div>
    <div class="content">
        <div class="row">
            <div class="col-lg-6">
                名称
            </div>
            <div class="col-lg-2">
                新卡片
            </div>
            <div class="col-lg-2">
                复习卡片
            </div>
            <div class="col-lg-2">
                <img onclick="addStudyList()" src="../websrc/img/add.png" alt="添加">
            </div>
        </div>
        <ul>
            <li v-for="(studyList,index) in studyLists">
                <div class="row">
                    <div class="col-lg-6">
                        <a :href="studyList.id">{{studyList.name}}</a>
                    </div>
                    <div class="col-lg-2 newCount">
                        {{studyList.newCount}}
                    </div>
                    <div class="col-lg-2 reviewCount">
                        {{studyList.reviewCount}}
                    </div>
                    <div class="col-lg-2 imgEdit">
                        <img v-on:click="editStudyList(studyList.id)" src="../websrc/img/edit.png" alt="编辑">
                        <img v-on:click="deleteStudyList(studyList.id)" src="../websrc/img/delete.png" alt="删除">
                    </div>
                </div>
            </li>
        </ul>
    </div>
</div>
<div id="studyListInfo">
    <div class="overlay"></div>
    <div id="studyListView">
        <h2>{{type}}</h2>
        <h6>学习列表名称</h6>
        <input v-model="name">
        <h6>学习列表筛选条件</h6>
        <ul>
            <li v-for="(condition,index) in conditions">
                <span :id="'conditionName'+index">{{condition.name}}</span>

                <div id="conditionPattern" class="sel1 input-group-btn patterns" data-id="0" name="sel1">
                    <button type="button" :id="'conditionPatternBtn'+index" class="btn btn-default dropdown-toggle"
                            data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
                            value="">
                        {{condition.pattern}}
                         <span class="caret"></span></button>
                    <ul class="dropdown-menu">
                        <li v-for="pattern in condition.patterns">
                            <a :href="'javascript:changeDropDownBtnValue('+pattern+',conditionPatternBtn'+index+')'"
                               name=''
                               value=''>
                                {{pattern}}
                            </a>
                        </li>
                    </ul>
                </div>
                <input type="text" v-model="condition.value">
            </li>
        </ul>
    </div>
</div>
<!--插件-->
<script type="text/javascript"
        src="../websrc/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</body>
</html>